<!-- 用户地址管理 -->
<template>
  <page-header-wrapper>
    <a-card class="table-card">
      <GzSearchForm :searchFunc="searchFunc" :resetFunc="() => { searchData = {} }" searchConditionNum="6">
        <!-- <GzTextUp placeholder="昵称" v-model:value="searchData['nickName']" /> -->
        <GzTextUp v-model:value="searchData['phone']" placeholder="手机号码" />
        <GzTextUp v-model:value="searchData['mchNo']" placeholder="商户号" />
      </GzSearchForm>
      <!-- 列表渲染 -->
      <GzTable
        ref="infoTableRef"
        :init-data="true"
        :req-table-data-func="reqTableDataFunc"
        :table-columns="tableColumns"
        :search-data="searchData"
      >
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'mchNo'">
            <span>{{ record.isDeleted ==0 ? record.mchNo : '--' }}</span>
          </template>
          <template v-if="column.key === 'sex'">
            <span v-if="record.sex == 0">未知</span>
            <span v-if="record.sex == 1">男</span>
            <span v-if="record.sex == 2">女</span>
          </template>
          <template v-if="column.key === 'mchName'">
            <span>{{ record.mchName ? record.mchName : '--' }}</span>
          </template>
        </template>
      </GzTable>
    </a-card>
  </page-header-wrapper>
</template>

<script lang="ts" setup>
import {$getFansMuchList} from '@/api/fansManage/fansMch/index'
import { ref, reactive } from 'vue'

const infoTableRef = ref()

let tableColumns = reactive([
  { key: 'nickName', title: '昵称', dataIndex: 'nickName', fixed: 'left' },
  { key: 'phone', title: '手机号码', dataIndex: 'phone' },
  { key: 'cstmName', title: '真实姓名', dataIndex: 'cstmName' },
  { key: 'mchNo', title: '商户号', dataIndex: 'mchNo' },
  { key: 'mchName', title: '商户名称', dataIndex: 'mchName' },
])
const searchData: any = ref({})
// 请求table接口数据
function reqTableDataFunc(params: any) {
  return $getFansMuchList({ ...params, flag: 2 })
}
// 搜索
function searchFunc() {
  infoTableRef.value.refTable(true)
}
</script>